diff options
Diffstat (limited to 'src/app/groups/[groupId]/reimbursement-list.tsx')
| -rw-r--r-- | src/app/groups/[groupId]/reimbursement-list.tsx | 12 |
1 files changed, 7 insertions, 5 deletions
diff --git a/src/app/groups/[groupId]/reimbursement-list.tsx b/src/app/groups/[groupId]/reimbursement-list.tsx index 3fc94bc..e8400ca 100644 --- a/src/app/groups/[groupId]/reimbursement-list.tsx +++ b/src/app/groups/[groupId]/reimbursement-list.tsx @@ -20,11 +20,13 @@ export function ReimbursementList({ return ( <div className="text-sm"> {reimbursements.map((reimbursement, index) => ( - <div className="border-t p-4 flex justify-between" key={index}> - <div> - <strong>{getParticipant(reimbursement.from)?.name}</strong> owes{' '} - <strong>{getParticipant(reimbursement.to)?.name}</strong> - <Button variant="link" asChild className="-my-3"> + <div className="border-t px-6 py-4 flex justify-between" key={index}> + <div className="flex flex-col gap-1 items-start sm:flex-row sm:items-baseline sm:gap-4"> + <div> + <strong>{getParticipant(reimbursement.from)?.name}</strong> owes{' '} + <strong>{getParticipant(reimbursement.to)?.name}</strong> + </div> + <Button variant="link" asChild className="-mx-4 -my-3"> <Link href={`/groups/${groupId}/expenses/create?reimbursement=yes&from=${reimbursement.from}&to=${reimbursement.to}&amount=${reimbursement.amount}`} > |